// main.js - 主脚本
import InputHandler from './input.js'
import Player from './player.js'

// 获取Canvas和上下文
const canvas = document.getElementById('canvas1')
const ctx = canvas.getContext('2d')
// 地图尺寸
const MAP_WIDTH = 4000
const MAP_HEIGHT = 2500

// 初始化输入处理和玩家
const input = new InputHandler()
const player = new Player(MAP_WIDTH, MAP_HEIGHT)

// 设置Canvas尺寸
canvas.width = window.innerWidth
canvas.height = window.innerHeight
const { width, height } = canvas


// 摄像机设置
const camera = {
    x: player.x - width / 2 + player.width / 2,
    y: player.y - height / 2 + player.height / 2,
    width: width,
    height: height,
    smoothness: 0.008
}



// 更新摄像机位置
function updateCamera() {
    // 计算目标位置（使玩家位于屏幕中央）
    const targetX = player.x - camera.width / 2 + player.width / 2
    const targetY = player.y - camera.height / 2 + player.height / 2

    // 使用线性插值实现平滑移动
    camera.x += (targetX - camera.x) * camera.smoothness
    camera.y += (targetY - camera.y) * camera.smoothness

    // 确保摄像机不超出地图边界
    // camera.x = Math.max(0, Math.min(MAP_WIDTH - camera.width, camera.x))
    // camera.y = Math.max(0, Math.min(MAP_HEIGHT - camera.height, camera.y))
}

// 绘制网格（修正版，真正不绘制边界外的网格）
function drawGrid() {
    const gridSize = 60

    // 计算可见区域的网格范围（考虑地图边界）
    const startX = Math.max(0, Math.floor(camera.x / gridSize) * gridSize)
    const startY = Math.max(0, Math.floor(camera.y / gridSize) * gridSize)

    // 计算结束位置，确保不超出地图
    const endX = Math.min(MAP_WIDTH, Math.ceil((camera.x + camera.width) / gridSize) * gridSize)
    const endY = Math.min(MAP_HEIGHT, Math.ceil((camera.y + camera.height) / gridSize) * gridSize)

    ctx.strokeStyle = 'rgba(255, 255, 255, 0.1)'
    ctx.lineWidth = 1

    // 绘制垂直线
    for (let x = startX; x <= endX; x += gridSize) {
        // 确保x在地图范围内
        if (x < 0 || x > MAP_WIDTH) continue

        // 计算屏幕坐标
        const screenX = x - camera.x

        // 只绘制在画布可见范围内的线
        if (screenX >= 0 && screenX <= camera.width) {
            ctx.beginPath()
            ctx.moveTo(screenX, 0)
            ctx.lineTo(screenX, camera.height)
            ctx.stroke()
        }
    }

    // 绘制水平线
    for (let y = startY; y <= endY; y += gridSize) {
        // 确保y在地图范围内
        if (y < 0 || y > MAP_HEIGHT) continue

        // 计算屏幕坐标
        const screenY = y - camera.y

        // 只绘制在画布可见范围内的线
        if (screenY >= 0 && screenY <= camera.height) {
            ctx.beginPath()
            ctx.moveTo(0, screenY)
            ctx.lineTo(camera.width, screenY)
            ctx.stroke()
        }
    }
}


// 绘制信息面板
function drawInfo() {
    ctx.fillStyle = 'white'
    ctx.font = '14px Arial'
    ctx.fillText(`玩家坐标: (${Math.floor(player.x + player.width / 2)}, ${Math.floor(player.y + player.height / 2)})`, 10, 25)
    ctx.fillText(`摄像机坐标: (${Math.floor(camera.x + camera.width / 2)}, ${Math.floor(camera.y + camera.height / 2)})`, 10, 45)
    ctx.fillText(`使用WASD或方向键移动`, 10, 65)
}

// 游戏主循环
let lastTime = 0
function gameLoop(timestamp) {
    const deltaTime = timestamp - lastTime
    lastTime = timestamp

    // 清除画布
    ctx.clearRect(0, 0, canvas.width, canvas.height)

    // 更新游戏状态
    player.update(input, deltaTime)
    updateCamera()

    // 绘制游戏元素
    drawGrid()
    // 在gameLoop中修改绘制调用
    player.draw(ctx, camera)  // 传入camera参数
    drawInfo()

    // 继续循环
    requestAnimationFrame(gameLoop)
}

// 启动游戏
gameLoop(0)

// 窗口大小调整处理
window.addEventListener('resize', () => {
    canvas.width = window.innerWidth
    canvas.height = window.innerHeight
    camera.width = canvas.width
    camera.height = canvas.height
})